<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
		<link href="../css/mui.picker.css" rel="stylesheet" />
		<link href="../css/mui.poppicker.css" rel="stylesheet" />
		<link rel="stylesheet" href="../css/mui.min.css" />
		<link rel="stylesheet" type="text/css" href="../css/icons-extra.css" />
	</head>

	<body>
		<header class="mui-bar mui-bar-nav" style="height:55px">
			<div style="accelerator: 5px; margin-top: 15px;">
				<!--返回主页面-->
				<a class=" mui-icon mui-icon-left-nav mui-pull-left mui-action-back"></a>
				<!--搜索框-->
				<h1 class="mui-title">
				<form target="frameFile" id="search_from"> 
				<input id="input_search" autofocus="autofocus" type="search" class="mui-input-clear" width="80%" placeholder="找工作 找小区">
			    </form>
			</h1>
				<!--搜索图标-->
				<li class="mui-btn mui-btn-link mui-pull-right">
					<span class="mui-icon mui-icon-search" type="button" onclick="search_0()"></span>
				</li>
			</div>
		</header>
		<div class="mui-content">
			<div class="mui-table-view">
				<label style="margin-left: 2%;">历史记录：</label>
				<li class="mui-table-view-cell" id="li_0" style="display: ;">
					<p id="search0" style="margin-left: 10%;" onclick="search(0)"></p>
				</li>
				<li class="mui-table-view-cell" id="li_1" style="display: ;">
					<p id="search1" style="margin-left: 10%;" onclick="search(1)"></p>
				</li>
				<li class="mui-table-view-cell" id="li_2" style="display: ;">
					<p id="search2" style="margin-left: 10%;" onclick="search(2)"></p>
				</li>
				<li class="mui-table-view-cell" id="li_3" style="display: ;">
					<p id="search3" style="margin-left: 10%;" onclick="search(3)"></p>
				</li>
				<li class="mui-table-view-cell" id="li_4" style="display: ;">
					<p id="search4" style="margin-left: 10%;" onclick="search(4)"></p>
				</li>
				<li class="mui-table-view-cell" id="li_5" style="display: ;">
					<p id="search5" style="margin-left: 10%;" onclick="search(5)"></p>
				</li>
				<li class="mui-table-view-cell" id="li_6" style="display: ;">
					<p id="search6" style="margin-left: 10%;" onclick="search(6)"></p>
				</li>
			</div>
		</div>

	</body>
	<script src="../js/mui.min.js"></script>
	<script src="../js/urlconfiguration.js"></script>
	<script src="../js/mui.picker.min.js"></script>
	<script src="../js/mui.poppicker.js"></script>
	<script src="../js/city.data.js" type="text/javascript" charset="utf-8"></script>
	<script src="../js/city.data-3.js" type="text/javascript" charset="utf-8"></script>
	<script src="../js/jquery-1.6.2.min.js"></script>
	<script type="text/javascript">
		var a = new Array(8);
		var arr = new Array(8);
		a = a.join(' ,').split(',');
		a.lenth = a.lenth - 1;
		var jumpFlag;
		var old_back = mui.back;
		var flag = 1;
		//加载页面			
		(function($, doc) {
			for(var i = 7; i--; i >= 0) {
				arr[i] = localStorage.getItem("a_" + i);
				if(arr[i].length < 1) {
					doc.getElementById("li_" + i).style.display = "none";
				} else {
					doc.getElementById("search" + i).innerHTML = arr[i];
				}
				if(arr[0] == "undefined" || arr[0] == null) {
					doc.getElementById("search" + 0).innerHTML = "暂无历史记录";
				}
			}
		})(mui, document)

		//绑定输入键盘搜索按钮监听事件	
		document.getElementById('search_from').onsubmit = function(e) {
			search_0();
		}

		//把搜索框的内容加入到历史记录 
		function search_0() {
			var account = document.getElementById("input_search").value;
			if(account.length < 1) {
				mui.alert("请输入关键字后再查询！")
				return
			}
			for(i = 7; i--; i > 0) { //数组后移，空出一位
				arr[i] = arr[i - 1];
			}
			arr[0] = account; //新的记录存入数组
			for(i = 7; i--; i >= 0) {
				document.getElementById("search" + i).innerHTML = arr[i]; //循环输出数组中的记录
				localStorage.setItem("a_" + i, arr[i]); //把对应的值存到本地的a_i中 			
			}
			jumpPage();
		}

		//跳转到查询后的首页
		function jumpPage() {
			var input_value = $("#input_search").val();
			localStorage.setItem("jumpFlag", flag);
			localStorage.setItem("input_value", input_value);
			old_back();
			var list = plus.webview.currentWebview().opener();
			//触发父页面的自定义事件(refresh),从而进行刷新
			mui.fire(list, 'refreshmain');
			//返回true,继续页面关闭逻辑
			return true;

		}

		function search(id) {
			var account = document.getElementById("search" + id).innerHTML;
			document.getElementById("input_search").setAttribute("value", account);
		}
	</script>

</html>